<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>内容选择器</title>
    <script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
             //:contains(text)
            //包含"运动鞋"的表格行背景色为蓝色
   $("td:contains('运动鞋')").css("background","red");  
            //:empty
            //没有内容的单元格背景色为红色
$("td:empty").css("background","green");
            //:has(selector)
            //包含连接的单元格背景色为绿色
$("td:has(a)").css("background","pink");
            //:parent
            //含有子节点或文本的表格背景色为灰色
$("td:parent").css("background","blue");

            //代码
          /*   $("td:contains('运动鞋')").css("background-color","blue");  //包含"运动鞋"的表格行背景色为蓝色
            $("td:empty").css("background-color","red"); //没有内容的单元格背景色为红色
            $("td:has('a')").css("background-color","green");//包含连接的单元格背景色为绿色
            $("td:parent").css("background-color","gray");//含有子节点或文本的表格背景色为灰色 */





        });
    </script>
</head>
<body>
<table>
    <thead >
        <tr style="background-color: #aaaaaa;">
            <th>序号</th>
            <th>订单号</th>
            <th>商品名称</th>
            <th>价格(元)</th>
        </tr>
    </thead>
    <tr>
        <td>1</td>
        <td>10035900</td>
        <td><a href="#">Nike透气减震运动鞋</a></td>
        <td>231.00</td>
    </tr>
    <tr>
        <td>2</td>
        <td>10036114</td>
        <td>天美太阳伞</td>
        <td>51.00</td>
    </tr>
    <tr>
        <td>3</td>
        <td>10035110</td>
        <td><a href="#">万圣节儿童蜘蛛侠装</a></td>
        <td>31.00</td>
    </tr>
    <tr>
        <td>4</td>
        <td>10035120</td>
        <td>匹克篮球运动鞋</td>
        <td>231.00</td>
    </tr>
    <tr>
        <td>5</td>
        <td>10032900</td>
        <td>jQuery权威指南</td>
        <td></td>
    </tr>
</table>
</body>
</html>